<template>
    <!-- 已完成文件 -->
    <div>
      <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>文件审批</el-breadcrumb-item>
        <el-breadcrumb-item>已完成文件</el-breadcrumb-item>
      </el-breadcrumb>
      <el-card shadow="always">
        <el-table
          :data="
            filelist1.slice(
              (pageData.pageNum - 1) * pageData.pageSize,
              pageData.pageNum * pageData.pageSize
            )
          "
          border=""
        >
          <el-table-column label="文件名" prop="fileName"></el-table-column>
          <el-table-column label="发起方式" prop="mode"></el-table-column>
          <el-table-column label="发起公司" prop="companyName"></el-table-column>
          <el-table-column
            label="发起个人"
            prop="applicantName"
          ></el-table-column>
          <el-table-column label="签署状态" prop="signStatus"></el-table-column>
          <el-table-column
            label="签署完成日期"
            prop="installDate"
            :formatter="formatDate"
          ></el-table-column>
          <el-table-column label="操作">
          <template v-slot="scope" >
            <el-button size="small" type="text" @click="tofile(scope.row)">
                        <a>文件详情</a>
            </el-button>
          </template>
        </el-table-column>
        </el-table>
  
        <div>
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="pageData.pageNum"
            :page-sizes="[10, 20, 25, 30]"
            :page-size="pageData.pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
          >
          </el-pagination>
        </div>
      </el-card>
    </div>
  </template>
    
    <script>
  import axios from "axios";
  import { getStatus5 } from "@/http/api";
  export default {
    data() {
      return {
        filelist1: [],
        pageData: {
          pageNum: 1,
          pageSize: 10,
        },
        total: 0,
      };
    },
    created() {
      this.getfilelist1();
    },
    methods: {
      tofile(val){
        this.$router.push({ name: "mefile", query: { id: val } });
      },
      handleSizeChange(val) {
        // console.log(`每页 ${val} 条`);
        this.pageData.pageSize = val;
        this.pageData.pageNum = 1;
        this.getfilelist1()
      },
      handleCurrentChange(val) {
        console.log(`当前页: ${val}`);
        this.pageData.pageNum = val;
        
      },
      //时间格式化
      formatDate(row, column, cellValue, index) {
        let format = "YYYY-mm-dd HH:MM:SS";
        let date = new Date(cellValue);
        const dataItem = {
          "Y+": date.getFullYear().toString(),
          "m+": (date.getMonth() + 1).toString(),
          "d+": date.getDate().toString(),
          "H+": date.getHours().toString(),
          "M+": date.getMinutes().toString(),
          "S+": date.getSeconds().toString(),
        };
        Object.keys(dataItem).forEach((item) => {
          const ret = new RegExp(`(${item})`).exec(format);
          if (ret) {
            format = format.replace(
              ret[1],
              ret[1].length === 1
                ? dataItem[item]
                : dataItem[item].padStart(ret[1].length, "0")
            );
          }
        });
        return format;
      },
      getfilelist1() {
        const data = {
          id:localStorage.getItem('id'),
          controllerId:localStorage.getItem('controllerId')
        };
        getStatus5(data).then((res) => {
          console.log(res);
          this.filelist1 = res.data.reverse();
          this.total = res.data.length;
        });
      },
    },
  };
  </script>
    
    <style lang="less" scoped>
  </style>